import React, { useState } from 'react'
import style from './style.module.scss'
import ModalView from '../../ModalView'
import EditPhotoCard from '../../Card/EditPhotoCard'
import EditCollectionCard from '../../Card/EditCollectionCard'

interface EditModalProps {
    data: any
}

export function EditPhotoModal(props: EditModalProps) {
    const [expend, setExpend] = useState(false)

    return (
        <ModalView
            onClose={() => {
                setExpend(false)
            }}>
            <div className={style.photo__container}>
                <div className={style.photo__bg}>
                    <img src={props.data.img} />
                </div>
                <EditPhotoCard imgId={props.data.imgId} data={props.data} />
            </div>
        </ModalView>
    )
}

export function EditCollectionModal(props: EditModalProps) {
    const [expend, setExpend] = useState(false)

    return (
        <ModalView
            onClose={() => {
                setExpend(false)
            }}>
            <div className={style.collection__container}>
                <EditCollectionCard />
            </div>
        </ModalView>
    )
}
